<template>
	<view>
		<view class="bg-white p-4" style="width: 2000rpx;">
			<!-- 顶部导航 -->
			<view class="flex justify-between mb-2" style="border-bottom: 3rpx solid #bbb;">
				<view class="flex justify-between" style="width: 20%;">
					<view @click="select(i)" v-for="(item,i) in navData" style="transition: all 0.5s;" :key="i" :class="(i==activecolor)?'borders':''" class=" px-2">
						<text style="transition: all 0.5s;" :class="(i==activecolor)?'text-orange':''">{{item.title}}</text>
					</view>
				</view>
				<view class="">
					<button class="uni-button" type="primary" size="mini">加入/认证商家</button>
				</view>
			</view>
			<!-- 内容 -->
			<view v-if="show" class="my-2 mt-4 w-100">
				<uni-table :loading="loading" border stripe emptyText="暂无更多数据" >
					<!-- 表头行 -->
					<uni-tr>
						<uni-th align="center">商家名称</uni-th>
						<uni-th align="center">加入时间</uni-th>
						<uni-th align="center">认证状态</uni-th>
						<uni-th align="center">商家类型</uni-th>
						<uni-th align="center">账号</uni-th>
						<uni-th align="center">身份</uni-th>
						<uni-th align="center">操作</uni-th>
					</uni-tr>
					<!-- 表格数据行 -->
					<uni-tr v-for="(item,i) in tableData" :key="i">
						<uni-td align="center">{{item.ID_Name}}</uni-td>
						<uni-td align="center">{{item.Authentication_Date}}</uni-td>
						<uni-td align="center">
							<text v-if="item.Authentication_Type=='0'">审核个体</text>
							<text v-if="item.Authentication_Type=='1'">审核企业</text>
							<text v-if="item.Authentication_Type=='2'">已通过个体</text>
							<text v-if="item.Authentication_Type=='3'">已通过企业</text>
							<text v-if="item.Authentication_Type=='4'">未通过个体</text>
							<text v-if="item.Authentication_Type=='5'">未通过企业</text>
						</uni-td>
						<uni-td align="center">{{item.Enterprise_Type=='1'?'企业商家':'个体商家'}}</uni-td>
						<uni-td align="center">{{item.User_Number}}</uni-td>
						<uni-td align="center">{{item.Admin_Type=='1'?'管理员':'普通成员'}}</uni-td>
						<uni-td align="center">
							<button size="mini" class="uni-button" type="primary">查看详情</button>
						</uni-td>
					</uni-tr>
				</uni-table>
			</view>
			<view v-else class="my-2 mt-4 w-100">
				<uni-table :loading="loading" border stripe emptyText="暂无更多数据" >
					<!-- 表头行 -->
					<uni-tr>
						<uni-th align="center">商家名称</uni-th>
						<uni-th align="center">商家类型</uni-th>
						<uni-th align="center">申请时间</uni-th>
						<uni-th align="center">状态</uni-th>
						<uni-th align="center">操作</uni-th>
					</uni-tr>
					<!-- 表格数据行 -->
					<uni-tr>
						<uni-td align="center">2020-10-20</uni-td>
						<uni-td align="center">Jeson</uni-td>
						<uni-td align="center">北京市海淀区</uni-td>
						<uni-td align="center">2020-10-20</uni-td>
						<uni-td align="center">Jeson</uni-td>
					</uni-tr>
				</uni-table>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp()
	export default {
		name:"MerchantListings",
		data() {
			return {
				activecolor: 0,
				show:true,
				loading:false,
				form:{
					User_Number:'',
					page:1,
					limit:10,
					token:'',
				},
				limit:1,
				navData:[
					{
						title:'关联商家'
					},
					{
						title:'申请记录'
					},
				],
				tableData:[]
			};
		},
		methods:{
			select(i){
				this.activecolor = i
				if(i==0){
					this.show = true
				}else{
					this.show = false
				}
			},
			getMerchantList(data){
				this.loading = true
				uni.request({
					url:app.globalData.Domain_Name + '/getSystemUserID',
					header: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					method: "POST",
					data,
					success: (res) => {
						console.log(res.data)
						this.loading = false
						this.limit = res.data.limit
						this.tableData = res.data.tableData
					}
				})
			}
		},
		mounted() {
			this.form.token = uni.getStorageSync('token')
			this.form.User_Number = uni.getStorageSync('use')
			this.getMerchantList(this.form)
		}
	}
</script>

<style lang="scss">
.borders{
	border-bottom: 2rpx solid #fc7c08;
	transition: all 0.5s;
}
</style>